/**
 * @description 登录、获取路由信息、退出登录、清除accessToken逻辑，不建议修改
 */
import { login, logout, getMenus } from '@/api/user'
import {
  getAccessToken,
  removeAccessToken,
  setAccessToken,
} from '@/utils/accessToken'
import { addAsyncRoutes, default as router } from '@/router'
import {
  themeStyle as tStyle,
  themeColor as tcolor,
  tokenName,
  pageDefaultLayout,
} from '@/config'
import { message } from '@/utils/message'

const state = {
  accessToken: getAccessToken(),
  themeStyle: localStorage.getItem('themeStyle') || tStyle, //主题风格 1 全白 2 导航黑 3 黑暗模式
  themeColor: localStorage.getItem('themeColor') || tcolor, //主题颜色
  pageLayout: localStorage.getItem('pageLayout') || pageDefaultLayout, //页面布局 sidemenu topmenu
  username: '',
  menus: [],
}

const getters = {
  accessToken: (state) => state.accessToken,
  themeStyle: (state) => state.themeStyle,
  themeColor: (state) => state.themeColor,
  pageLayout: (state) => state.pageLayout,
  username: (state) => state.username,
  menus: (state) => state.menus,
}

const mutations = {
  /**
   * @description 设置accessToken
   * @param {*} state
   * @param {*} accessToken
   */
  setAccessToken(state, accessToken) {
    state.accessToken = accessToken
    setAccessToken(accessToken)
  },
  /**
   * @description 设置主题风格
   * @param {*} state
   * @param {*} accessToken
   */
  setThemeStyle(state, themeStyle) {
    state.themeStyle = themeStyle
    localStorage.setItem('themeStyle', themeStyle)
  },
  /**
   * @description 设置主题颜色
   * @param {*} state
   * @param {*} accessToken
   */
  setThemeColor(state, themeColor) {
    state.themeColor = themeColor
    localStorage.setItem('themeColor', themeColor)
  },
  /**
   * @description 设置页面布局
   * @param {*} state
   * @param {*} accessToken
   */
  setPageLayout(state, pageLayout) {
    state.pageLayout = pageLayout
    localStorage.setItem('pageLayout', pageLayout)
  },
  /**
   * @description 设置用户名
   * @param {*} state
   * @param {*} username
   */
  setUserName(state, username) {
    state.username = username
  },
  /**
   * @description 设置菜单
   * @param {*} state
   * @param {*} menus
   */
  setMenus(state, menus) {
    state.menus = menus
  },
}

const actions = {
  /**
   * @description 登录
   * @param {*} { commit }
   * @param {*} userInfo
   */
  async login({ dispatch, commit }, userInfo) {
    const { data } = await login(userInfo)
    const accessToken = data[tokenName]
    if (accessToken) {
      commit('setAccessToken', accessToken)
      //重置菜单
      await dispatch('resetMenus')
    } else {
      message.error(`登录接口异常，未正确返回${tokenName}...`)
    }
  },
  /**
   * @description 退出登录
   */
  async logout({ dispatch }) {
    await logout(state.accessToken)
    await dispatch('resetAll')
  },
  /**
   * @description 重置accessToken等
   * @param {*} { commit, dispatch }
   */
  async resetAll({ commit, dispatch }) {
    // 清空token
    await dispatch('setAccessToken', '')
    removeAccessToken()
    // 清空路由
    await dispatch('resetMenus')
    // 清空用户信息
    commit('setUserName', '')
    router.push({
      name: 'login',
      query: { redirect: router.currentRoute.value.fullPath },
    })
  },
  /**
   * @description 设置token
   */
  setAccessToken({ commit }, accessToken) {
    commit('setAccessToken', accessToken)
  },
  /**
   * @description 重置菜单
   * @param {*} { commit }
   * @param {*} accessToken
   * @return {*}
   */
  async resetMenus({ commit }) {
    if (state.accessToken) {
      // 添加异步路由
      const { menus } = await getMenus(state.accessToken)
      commit('setMenus', menus)
      addAsyncRoutes(menus)
    } else {
      // 清空异步路由
      commit('setMenus', [])
      addAsyncRoutes([])
    }
  },
}

export default { state, getters, mutations, actions }
